<template>
    <div id="app">
        <!--<img alt="Vue logo" src="./assets/logo.png">-->
        <!--        <HelloWorld/>-->
        <!--        <PassValue/>-->
        <!--<SelfSlot>
        小心危险
        </SelfSlot>-->
        <SocketIo></SocketIo>
    </div>
</template>

<script>
    /*
* 基础命令
* */
    import HelloWorld from "./components/HelloWorld.vue"
    /*
    * 子父组件传值
    * */
    import PassValue from "./components/passvalue/PassValue"
    /*
    * 插槽
    * */
    import SelfSlot from "./components/slot/SelfSlot"
    import SocketIo from "./components/socketio/SocketIo"
    import io from "socket.io-client"

    export default {
        name: "App",
        components: {
            HelloWorld,
            PassValue,
            SelfSlot,
            SocketIo
        },
        mounted() {
            let socket = io("http://localhost:8337");
            socket.on("connect", () => {
                console.log("连接成功");
                socket.emit("clientMsg", "客户端发送消息")
            });
            socket.on("serverMsg", (data) => {
                console.log("事件", data);
            });
            socket.on("disconnect", () => {
                console.log("关闭连接");
            });
        }
    }
</script>

<style>
    #app {
        font-family: Avenir, Helvetica, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        text-align: center;
        color: #2c3e50;
        margin-top: 60px;
    }
</style>
